<template>
	<view style="overflow-x: hidden;">
		<userinfo id="user" :options="user_options" @getUserscope="getUserInfo" @toLogin="getUserInfo"></userinfo>

		<view class="container">
			<form @submit="formSubmit">
				<view class="formView">

					<view class="item border-b">
						<view class="desc">
							<lang keywords="联系人"></lang>
						</view>
						<view class="content">
							<input placeholder-class="placeholder" name="name" type="text" :placeholder="placeholder_name" :value="now_address.name || wx_address.userName"></input>
						</view>
					</view>

					<view class="item border-b" v-if="!open_multilingual">
						<view class="desc"></view>
						<view class="content">
							<view @tap="selectSex($event)" data-sex="1">
								<text :class="'iconfont  ' + (sex == 1 ? 'icon-gou' : 'icon-quan')" :style="'color:' + config.mobile_head_color"></text>
								<lang keywords="先生"></lang>
							</view>
							<view @tap="selectSex($event)" data-sex="2">
								<text :class="'iconfont ' + (sex == 2 ? 'icon-gou' : 'icon-quan')" :style="'color:' + config.mobile_head_color"></text>
								<lang keywords="女士"></lang>
							</view>
						</view>
					</view>

					<picker @change="national_change($event)" :range="national_list_show" style="width:100%;"
					 v-if="national_list.length > 0">
						<view class="item border-b">
							<view class="desc c333">
								<lang keywords="国家/地区"></lang>
							</view>
							<view class="content national_show c333">{{ national_check.show }}</view>
							<text class="iconfont icon-xiala"></text>
						</view>
					</picker>

					<view class="item border-b">
						<view class="desc">
							<lang keywords="手机号"></lang>
						</view>
						<view class="content">
							<input name="phone" :placeholder="placeholder_phone" placeholder-class="placeholder" type="number" :value="now_address.phone|| wx_address.telNumber || user_phone"></input>
						</view>
					</view>

					<view class="item border-b">
						<view class="desc">
							<lang keywords="收货地址"></lang>
						</view>
						
						<view class="content" open-type="openSetting" @click.stop="chooseLocationHandle">
							<text class="iconfont icon-dingwei1"></text>
							<view class="address-box">
								<text class="address" v-if="position_obj.lng">{{position_obj.name || position_obj.lng}}</text>
								<block v-else>
									<lang class="placeholder" keywords="点击选择"></lang>
								</block>
							</view>
							<text class="iconfont icon-jiantou"></text>
							<button class="content btn" open-type="openSetting" @opensetting="openSetting" :hidden="settingBtn"></button>
						</view>

					</view>

					<view class="item border-b">
						<view class="desc">
							<lang keywords="地址备注"></lang>
						</view>
						<view class="content">
							<input name="detail" :placeholder="placeholder_address" placeholder-class="placeholder" :value="now_address.detail"></input>
						</view>
					</view>

					<view class="item border-b">
						<label>
							<checkbox-group name="default" class="fl">
								<checkbox value="1" :checked="(now_address.default == '1' ? true : false)"></checkbox>
							</checkbox-group>
							<lang class="defaultTxt" keywords="设为默认地址"></lang>
						</label>
					</view>
				</view>

				<view class="btn-box">
					<button class="edit" :style="'background:' + config.mobile_head_color" hover-class="edit-hover" formType="submit">
						<lang keywords="保存地址"></lang>
					</button>
					<button class="del" hover-class="del-hover" @tap="delAddress" v-if="address_id > 0">
						<lang keywords="删除"></lang>
					</button>
				</view>
			</form>
			
			<!-- #ifdef MP-WEIXIN -->
			<view class="wxapp-button" :hidden="address_id != 0 || config.international_phone">
				<button size="mini" :plain="true" @tap="addAdress($event)">
					<image src="/static/images/weixin_small.png"></image>
					<lang keywords="从微信地址中获取"></lang>
				</button>
			</view>
			<!-- #endif -->
		</view>

		<view class="mask" :hidden="!search_mask_show" @tap="closeMask">
			<view class="search-box border-b bg" @click.stop="nocloseMask">
				<view class="search-input">
					<text class="iconfont icon-sousuo"></text>
					<input :placeholder="inputSearchPlaceholder" placeholder-style="color:#999;" :value="inputSearchValue" @input="inputSearchAddress"
					 :focus="inputSearchFocus"></input>
					<text class="iconfont icon-cha1" @tap="clearInputSearchValue" :hidden="inputSearchValue == ''"></text>
				</view>
			</view>
			<view class="adress-list">
				<scroll-view scroll-y="true" style="height:100%;">
					<view>
						<view v-if="current_address && inputSearchValue == ''" class="adress current" @tap="selectAddress($event)" data-name="current">
							<view><text class="iconfont icon-ditudangqianweizhi"></text></view>
							<view>
								<view class="txt" :style="'color:' + mobile_head_color">
									<lang keywords="当前位置"></lang>
								</view>
								<view class="info">{{current_address.address_name}}</view>
							</view>
						</view>
						<view class="adress" v-for="(item, index) in searchAddressList" :key="index" @tap="selectAddress($event)" data-name="searchAddressList"
						 :data-index="index">
							<view class="desc">
								<text :class="(i.is_high ? 'active' : '' )" v-for="(i, index2) in item.name_arr" :key="index2">{{i.value}}</text>
								<text class="distance" v-if="item.distance">{{item.distance}}km</text>
							</view>
							<view class="info">
								<text>{{item.address}}</text>
							</view>
						</view>

					</view>
				</scroll-view>

			</view>
		</view>
	</view>
</template>

<script>
	import common from '../../utils/common.js';
	var app = getApp();
	var sysRes = {};
	var rpxUnit = 0;
	var _this;

	export default {
		data() {
			return {
				position_obj: {},
				map_content_height: 0,
				showMap: false,
				map_list: [],
				now_address: {},
				address_id: 0,
				upDown: true,
				messageDetail: false,
				cityDetail: false,
				cityDefult: 'Brisbane',
				//默认显示城市
				cityData: [],
				adress: '',
				lng: '',
				lat: '',
				wx_address: {},
				sex: 1,
				// 性别
				settingBtn: true,
				// 是否显示设置按钮
				national_list: [],
				national_list_show: [],
				national_check: {},
				national_list_index: 0,
				placeholder_name: '',
				placeholder_phone: '',
				placeholder_address: '',
				map_config: '',
				google_map_position: false,
				user_phone: null,
				user_phone_area: '',
				current_address: '',
				user_options: {},
				config: {},
				search_mask_show: false,
				inputSearchValue: '',
				inputSearchPlaceholder: '',
				searchAddressList: [],
				inputSearchFocus: false,
				open_multilingual: app.globalData.open_multilingual
			};
		},

		onLoad: function(options) {
			_this = this; // 页面初始化 options为页面跳转所带来的参数

			if (options.address_id) {
				this.address_id = options.address_id
			}

			var tmp = options.isFromOther ? '常用' : '收货';
			var title = options.address_id > 0 ? '编辑' + tmp + '地址' : '添加' + tmp + '地址';
			wx.setNavigationBarTitle({
				title: common.changeTxt(title)
			});
			common.setMainColor(_this, function(config) {
				_this.config = config.config;

				if (config.config.map_config && config.config.map_config != 'baidu') {
					_this.map_config = config.config.map_config
					_this.google_map_position = config.config.google_map_position
				}

				if (app.globalData.userInfo) {
					_this.user_phone_area = app.globalData.userInfo.phone_country_type;
					_this.user_phone = app.globalData.userInfo.phone

					getNationalList();
				} else {
					_this.user_options = {
						toLogin: true
					}
				}
				
				_this.getCookieAddress()
			});
			// #ifdef MP-WEIXIN
			wx.getSetting({
				success: res => {
					console.log(res);
					console.log(res.authSetting['scope.userLocation']);

					if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
						//非初始化进入该页面,且未授权
						_this.settingBtn = false
					} else {
						//授权后默认加载
						_this.settingBtn = true
					}
				}
			});
			// #endif
			
			// #ifdef H5
			if (common.$checkPlat.checkIos()) {
				window.addEventListener('pageshow', _this.getCookieAddress())
			}
			// #endif

			_this.showPlaceHoder(true);
		},
		onShow () {
			// #ifdef H5
			common.hideWxShare()
			_this.getCookieAddress()
			// #endif
		},
		onUnload () {
			// #ifdef H5
			if (common.$checkPlat.checkIos()) {
				window.removeEventListener('pageshow', _this.getCookieAddress())
			}
			// #endif
		},
		methods: {
			getCookieAddress () {
				// #ifdef H5
					var res = app.globalData.myMapAddress
					if (res) {
						_this.position_obj = {
							name: res.adress,
							lng: '',
							lat: ''
						}
						common.changeLocation('getLocation', _this, res.longitude, res.latitude, 'gcj02');
						app.globalData.myMapAddress = ''
					}
				// #endif
			},
			national_change(res) {
				_this.national_check = _this.national_list[res.detail.value]
			},

			getUserInfo(e) {
				if (e.detail.userInfo) {
					_this.user_phone_area = app.globalData.userInfo.phone_country_type;
					_this.user_phone = app.globalData.userInfo.phone
					getNationalList();
				}
			},

			showPlaceHoder(show) {
				if (show) {
					var placeholder_name = common.changeTxt('最少2个字');
					var placeholder_phone = common.changeTxt('不少于7位');
					var placeholder_address = common.changeTxt('门牌号/楼层/公司名等');
				} else {
					var placeholder_name = '';
					var placeholder_phone = '';
					var placeholder_address = '';
				}

				_this.placeholder_name = placeholder_name
				_this.placeholder_phone = placeholder_phone
				_this.placeholder_address = placeholder_address
			},

			addAdress() {
				wx.chooseAddress({
					success: function(res) {
						var pp = res.provinceName + res.cityName + res.countyName;
						console.log(res);
						_this.wx_address = res
						_this.position_obj = {
							name: res.detailInfo
						}
						common.post('Map&a=suggestion', {
							area_name: res.cityName,
							query: pp + res.detailInfo
						}, "setArea", _this);
					}
				});
			},
			
			setArea(result){
				if(result.length > 0){
					_this.position_obj = {
						name: _this.position_obj.name,
						lng: result[0].lng,
						lat: result[0].lat,
					};
					console.log('_this.position_obj', _this.position_obj);
				}
			},

			getAddress() {
				if (_this.address_id > 0) {
					common.post('My&a=adress_show', {
						adress_id: _this.address_id,
						only_adress: true
					}, "setPageContent", _this);
				}
			},

			delAddress(e) {
				wx.showModal({
					title: common.changeTxt('删除提示'),
					content: common.changeTxt('您确定要删除该地址吗？不可恢复。'),
					showCancel: true,
					success: function(res) {
						if (res.confirm) {
							common.post('My&a=del_adress', {
								adress_id: _this.address_id
							}, "delAddressBack", _this);
						}
					}
				});
			},

			delAddressBack: function(result) {
				// #ifdef H5
					window.localStorage.setItem('packapp_editAddress', JSON.stringify({del: _this.address_id}));
				// #endif
				uni.setStorageSync('edit_address_id', 'delete')
				common.navigateBack();
			},
			formSubmit: function(e) {
				console.log(e.detail);
				console.log(_this.address_id);
				var error_tips = '';

				if (e.detail.value.name == '') {
					error_tips = '请填写姓名';
				} else if (e.detail.value.phone == '') {
					error_tips = '请填写电话';
				} else if (!this.position_obj.lng) {
					error_tips = '请选择位置';
				}

				if (error_tips != '') {
					wx.showModal({
						title: common.changeTxt('提示'),
						content: common.changeTxt(error_tips),
						showCancel: false
					});
					return false;
				}

				var postData = {
					adress_id: _this.address_id,
					name: e.detail.value.name,
					phone: e.detail.value.phone,
					adress: this.position_obj.name,
					detail: e.detail.value.detail,
					default: e.detail.value.default.length,
					longitude: this.position_obj.lng,
					latitude: this.position_obj.lat,
					sex: this.sex
				};

				if (_this.national_check && _this.national_check.code) {
					postData.phone_country_type = _this.national_check.code;
				}
				_this.addressInfo = postData
				common.post('My&a=edit_adress', postData, "saveAddressResult", this);
			},
			saveAddressResult: function(result) {
				console.log('添加地址', result, _this.addressInfo)
				if (_this.addressInfo.adress_id == 0) {
					_this.addressInfo.adress_id = result
				}
				uni.setStorageSync('edit_address_id', _this.addressInfo.adress_id)
				// #ifdef H5
					window.localStorage.setItem('packapp_editAddress', JSON.stringify(_this.addressInfo));
				// #endif
				
				common.navigateBack();
			},
			setPageContent: function(result) {
				

				_this.sex = result.now_adress[0] ? result.now_adress[0].sex : 1
				console.log('地址信息', _this.sex);
				_this.area_list = result
				_this.now_address = result.now_adress[0] ? result.now_adress[0] : {}
				_this.position_obj = result.now_adress[0] ? {
					name: result.now_adress[0].adress,
					lng: result.now_adress[0].longitude,
					lat: result.now_adress[0].latitude
				} : {}

				if (_this.config.international_phone && result.now_adress[0].phone_country_type) {
					for (var i in _this.national_list) {
						console.log(_this.national_list[i].code, result.now_adress[0].phone_country_type);

						if (_this.national_list[i].code == result.now_adress[0].phone_country_type) {
							_this.national_check = _this.national_list[i]
							_this.national_list_index = i
							break;
						}
					}
				}

				wx.hideToast();
			},

			// 选择性别
			selectSex(e) {
				this.sex = e.currentTarget.dataset.sex * 1
			},

			//搜索地址
			searchLocation() {
				getNearbyAddress();
				_this.search_mask_show = true
				_this.inputSearchValue = ''
				_this.searchAddressList = []
				_this.inputSearchPlaceholder = common.changeTxt('请输入您的收货地址')
				_this.inputSearchFocus = true

				_this.showPlaceHoder(false);
			},

			// 选中地址
			selectAddress(e) {
				if (e.currentTarget.dataset.name == 'current') {
					if (_this.current_address.google_place_id) {
						getAddressByPlaceId(_this.current_address.google_place_id);
						return;
					}

					_this.position_obj = {
						name: _this.current_address.address_name,
						lng: _this.current_address.lng,
						lat: _this.current_address.lat
					}

					_this.showPlaceHoder(true);

					return;
				}

				var index = e.currentTarget.dataset.index;
				var data = _this.searchAddressList[index];
				getAddressByPlaceId(data.place_id);
			},

			clearInputSearchValue() {
				_this.inputSearchValue = ''
				_this.searchAddressList = []
			},

			// 输入地址进行搜索
			inputSearchAddress(e) {
				clearTimeout(_this.timer);

				if (e.detail.value != '') {

					_this.inputSearchValue = e.detail.value

					_this.timer = setTimeout(() => {
						searchAddress();
					}, 400);
				}
			},

			closeMask() {
				_this.search_mask_show = false
				_this.showPlaceHoder(true);
			},

			nocloseMask() {},

			// 选择地址
			chooseLocationHandle() {
				// #ifdef H5
					uni.navigateTo({
						url: '/pages/my/openMap'
					});
				// #endif
				
				// #ifdef MP-WEIXIN
				wx.getSetting({
					success: res => {
						if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
							//非初始化进入该页面,且未授权
							_this.settingBtn = false
						} else if (res.authSetting['scope.userLocation'] == undefined) {
							//初始化进入
							_this.settingBtn = false
							chooseLocation();

						} else {
							//授权后默认加载
							_this.settingBtn = true
							chooseLocation();
						}
					}
				});
				// #endif
			},

			// 打开设置界面
			openSetting(e) {
				if (e.detail.authSetting["scope.userLocation"] == true) {
					_this.settingBtn = true
					//再次授权，调用getLocationt的API
					chooseLocation();
				} else {
					_this.settingBtn = false
				}
			},

			getLocation(res) {
				_this.position_obj.lng = res.lng;
				_this.position_obj.lat = res.lat; 
				// if (res.street) {
				//   _this.position_obj.name = res.street + ' ' + _this.position_obj.name
				// }
			}
		}
	};
	// 获取区号列表
	const getNationalList = () => {
		var config = _this.config;

		if (config.international_phone) {
			app.getNationalPhone(function(national_list) {
				var national_list_show = [];
				var national_list_index = 0;
				var national_check = national_list[0];

				for (var i in national_list) {
					national_list_show.push(national_list[i].show);

					if (_this.user_phone_area == national_list[i].code) {
						national_list_index = i;
						national_check = national_list[i];
					}
				}


				_this.national_list = national_list
				_this.national_list_show = national_list_show
				_this.national_check = national_check
				_this.national_list_index = national_list_index

				_this.getAddress();
			});
		} else {
			_this.getAddress();
		}
	};
	// 打开地图选择地址
	const chooseLocation = () => {
		uni.chooseLocation({
			type: 'gcj02',
			success: function(res) {
				console.log('选择位置成功', res);
				_this.position_obj = {
					name: res.name,
					lng: '',
					lat: ''
				}

				common.changeLocation('getLocation', _this, res.longitude, res.latitude, 'gcj02');
			}
		});
	};
	const searchAddress = () => {
		var param = {
			query: _this.inputSearchValue
		};
		common.post('Map&a=suggestion', param, data => {
			console.log('搜索地址结果', data);

			if (data) {

				_this.searchAddressList = data
			}
		});
	};
	const getAddressByPlaceId = place_id => {
		common.post('Map&a=getAddressByPlaceId', {
			place_id
		}, data => {
			if (data) {
				_this.position_obj = {
					name: data.address_name,
					lng: data.lng,
					lat: data.lat
				}

				_this.showPlaceHoder(true);
			}
		}, _this, error => {
			console.log('选择地址页，用place_id换取地址信息错误');
		});
	};
	const getNearbyAddress = str => {
		if (_this.current_address != '') {
			return;
		}

		wx.getLocation({
			success: function(res) {
				var param = {
					lng: res.longitude,
					lat: res.latitude,
					lbs_type: 'baidu'
				};
				common.post('Shop_new&a=lbs_location', param, data => {
					if (data) {
						delete data.pois;

						_this.current_address = data
					}
				});
			}
		});
	};
</script>
<style>
	page {
		background-color: white;
	}

	.formView {
		background-color: white;
	}

	.maskBg {
		background-color: rgba(0, 0, 0, 0.6);
		position: fixed;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		z-index: 998;
	}

	.choose_box {
		position: absolute;
		top: 5%;
		left: 5%;
		width: 90%;
		height: 90%;
		z-index: 999;
		background: white;
	}

	.map_nav {
		background: #e1e1e1;
		height: 80rpx;
		padding: 20rpx;
		box-shadow: #666 0 0 2px;
	}

	.map_nav input {
		background-color: white;
		height: 80rpx;
		line-height: 80rpx;
		padding-left: 20rpx;
	}

	.map_content {
		padding: 0 10rpx;
		width: auto;
	}

	.map_item {
		padding: 20rpx 24rpx;
		border-bottom: 2rpx solid #f1f1f1;
	}

	.map_item:last-child {
		border-bottom: none;
	}

	.map_item .desc {
		font-size: 24rpx;
		color: #666;
	}

	.map_nav {
		display: flex;
		-webkit-box-pack: justify;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-box-align: center;
	}

	.map_nav input {
		width: 70%;
	}

	.map_nav .city {
		display: inline-block;
		width: 25%;
		line-height: 40px;
		background: white;
		border-radius: 6rpx;
		position: relative;
	}

	.map_nav .city .city_name {
		margin-left: 20%;
		color: #333;
		width: 60%;
		display: inline-block;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.map_nav .city .up {
		display: inline-block;
		content: "";
		border-top: 2rpx solid #BFBFBF;
		border-left: 2rpx solid #BFBFBF;
		width: 16rpx;
		height: 16rpx;
		-webkit-transform: rotate(225deg);
		background-color: transparent;
		position: absolute;
		top: 28rpx;
		right: 16rpx;
	}

	.map_nav .city .up.active {
		-webkit-transform: rotate(45deg);
		position: absolute;
		top: 36rpx;
	}

	.city_content .city_item {
		width: 90%;
		padding: 20rpx 5%;
		border-bottom: 2rpx solid #eee;
	}



	.border-b {
		position: relative;
	}

	.border-b::after {
		content: '';
		position: absolute;
		bottom: 0;
		left: 30rpx;
		height: 1rpx;
		width: 100%;
		background: #efefef;
		transform: scaleY(0.5);
	}

	.item {
		display: flex;
		align-items: center;
		font-size: 15px;
		padding: 20rpx 30rpx;
	}

	.item .desc {
		flex: 1;
	}

	.item .content {
		flex: 3;
		display: flex;
		align-items: center;
		color: #333;
		position: relative;
	}

	.item .content input {
		width: 100%;
		height: 1.2rem;
		min-height: 1.2rem;
	}

	.item .content .iconfont {
		margin-right: 10px;
		font-size: 20px;
		color: #999;
	}

	.item .content .icon-gou {
		color: #06c1ae;
	}

	.item .content view:first-child {
		margin-right: 30px;
	}

	.item .placeholder {
		font-size: 14px;
		color: #999;
	}

	.item .content .icon-dingwei1 {
		font-size: 16px;
		margin-right: 5px;
	}

	.item .content .icon-jiantou {
		margin-right: 0;
	}

	.item .content .address-box {
		flex: 1;
	}

	.item .content.btn::after {
		border: none;
	}

	.item .content.btn {
		background: transparent;
		line-height: 1;
		padding: 0;
		font-size: 16px;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}

	.defaultTxt {
		line-height: 27px;
		margin-left: 5px;
	}

	.btn-box {
		display: flex;
		padding: 30rpx 0 30rpx 30rpx;
		background: #fff;
	}

	.btn-box button {
		background: #06c1ae;
		border-radius: 4px;
		color: #fff;
		font-size: 16px;
		height: 45px;
		line-height: 45px;
		flex: 1;
		margin-right: 30rpx;
	}

	.btn-box button::after {
		border: none;
	}

	.btn-box .edit-hover {
		background: #04ad9c
	}

	.btn-box .weixin {
		background: #09ba07;
	}

	.btn-box .weixin-hover {
		background: #08a005
	}

	.btn-box .del {
		background: #fb4e44;
	}

	.btn-box .del-hover {
		background: #e94239
	}


	.search-box {
		padding: 10px;
		display: flex;
		align-items: center;
		font-size: 16px;
		background: #fff;
	}

	.search-box .search-input {
		background: #f5f5f5;
		border-radius: 5rpx;
		font-size: 16px;
		color: #333;
		display: flex;
		align-items: center;
		padding: 20rpx 0 20rpx 20rpx;
		box-sizing: border-box;
		height: 70rpx;
		flex: 1;
	}

	.search-box .search-input .icon-sousuo {
		margin-right: 10rpx;
		color: #999;
	}

	.search-box .search-input input {
		flex: 1
	}

	.search-box .search-input .icon-cha1 {
		color: #999;
		padding: 20rpx;
	}

	.mask {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, .5);
		z-index: 9999;
	}

	.mask .adress-list {
		height: 100%;
	}

	.mask .adress-list .adress {
		margin: 0;
		padding: 20rpx 10px;
		background: #fff;
	}

	.mask .adress-list .distance {
		float: right;
		font-size: 12px;
		color: #999;
	}

	.mask .adress-list .adress .desc {
		font-size: 14px;
	}

	.mask .adress-list .adress .desc .active {
		color: #06c1ae;
	}

	.mask .adress-list .adress .info {
		margin-top: 5px;
		font-size: 14px;
	}

	.mask .adress-list .current {
		display: flex;
		align-items: center;
		color: #888;
	}

	.mask .adress-list .current .iconfont {
		font-size: 26px;
		margin-right: 10px;
		color: #333;
	}

	.mask .adress-list .current .txt {
		font-size: 14px;
	}

	.wxapp-button {
		margin-top: 160rpx;
		text-align: center;
	}

	.wxapp-button button {
		background: none;
		font-size: 28rpx;
		color: #51C332;
		border-color: #51C332;
	}

	.wxapp-button button image {
		width: 40rpx;
		height: 40rpx;
		vertical-align: middle;
		margin-right: 4rpx;
	}

	label {
		width: 100%;
	}

	/*checkbox 整体大小  */
	checkbox {
		width: 15px;
		height: 15px;
		margin-right: 5px;
	}

	/*checkbox 选项框大小  */
	checkbox .wx-checkbox-input {
		width: 15px;
		height: 15px;
	}
</style>
